@charset"utf-8";

      $fontsize:40;

@function r($px){
    @return $px/$fontsize*1rem 
}

* {
  margin: 0;
  padding: 0;
  list-style: none; }

html, body {
  height: 100%;
  width: 100%; }

.web {
  width: 100%;
  height: 100%;
  position: relative;
  background: #f7f7f7; }

header {
    border-bottom: r(1) solid #c1c1c1;
  width: 100%;
  height: 2.2rem;
  position: absolute;
  top: 0; }

footer {
  width: 100%;
  height: 75px;
background: red;
  position: absolute;
  bottom: 0; }

section {
  width: 100%;
  background: #f7f7f7;
  top: 2.2rem;
  
  bottom: r(10);
  position: absolute;
  overflow-y: scroll; }

/**/
.whole {
  width: 93.65%;
  height: 1.5rem;
  margin: 0 auto;
  margin-top: 0.35rem; 
  font-size: r(20);
  }
   .img1 {
    float: left;
    display: block;
    width: r(127);
    height:r(35); 

    margin-top: r(15);
    }
    .img2{
      img {
      width: r(22);
     height:r(37); 
      
      }
    }
    .img3{
        width: r(35);
        height: 100%;
        img{
            width: 100%;
            height: 100%;
        }
    }


.search {
    width: r(118);
    height: r(26); 
    color: #666666;
   line-height: 1.5rem;
   font-size: r(26)
    }


.choice {
width: 100%;
height: 2rem;
background: white;
margin-top: 0.325rem;
border-top: 0.025rem solid #e3e3e3;
border-bottom: 0.025rem solid #e3e3e3; }

.whole2{
    color: #666666;
    text-align: center;
     line-height: 1.5rem;
     font-size:r(33);
}


.spread{
    color: #666666;
    padding-top:r(20) ;
    font-size: r(29);
    
}

/**/
.inforscape{
    width: 100%;
    height: r(301);
    img{
        width: 100%;
        height: 100%;
    }
}
.inforscape_one{
    width: 100%;
    height: r(60);
    background: #f3f4f6;
    padding: r(15) r(20) 0 r(20);
    font-size: r(24);
    ul{
        li{
            float: right;
            a{
                color:#666666 ;
            }
        }
    }
    ul>li:nth-child(2){
        width: r(30);
        height: r(27);
        margin-right: r(12);
        margin-left: r(22);
        img{
            width: 100%;
            height: 100%;
        }
    }
    ul>li:nth-child(4){
        width: r(30);
        height: r(27);
        margin-right: r(11);
        img{
            width: 100%;
            height: 100%;
        }
    }
}
.Coupon{
    width: 100%;
    height: r(150);
    background: white;
    padding: r(20) r(20) r(20) r(20);
    ul{
        li{
            float: left;
            width: r(190);
            height: r(110);
            img{
                width: 100%;
                height: 100%;
            }
        }
    }
    ul>li:nth-child(2){
        margin: 0 r(15) 0 r(15);
    }
}
.Noodles{
    width: 100%;
    height: r(460);
    background: white;
    padding: 0 r(30) 0 r(30);
    
    .Number{
        width: 100%;
        height: r(90);
        font-size: r(26);
        line-height: r(35);
        letter-spacing:r(2);
    }
    .taste{
        width: 100%;
        height: r(80);
        font-size: r(23);
        color:#b4b4b4;
        line-height: r(32);
    }
    ul{
        width: 100%;
        height: r(185);
        margin-top: r(10);
        li{
            float: left;
            width: r(185);
            height: r(185);
            img{
                width: 100%;
                height: 100%;
            }
        }
    }
    ul>li:nth-child(2){
        margin: 0 r(12) 0 r(12);
    }
    .Price{
        width: 100%;
        height: r(90);
        font-size: r(25);
        color: #666666;
        line-height: r(90);
        background: white;
        border-bottom: r(1) solid #e0e0e0;
       .Collection{
           width: r(44);
           height: r(44);
           margin-top: r(15);
           margin-left: 8.3rem;
       
           img{
               float: right;
               width: 100%;
               height: 100%;
           }
       }
    }
     .Price2{
        width: 100%;
        height: r(90);
        font-size: r(25);
        color: #666666;
        line-height: r(90);
        background: white;
      
       .Collection{
           width: r(44);
           height: r(44);
           margin-top: r(15);
           margin-left: 8.3rem;
           
           img{
               float: right;
               width: 100%;
               height: 100%;
           }
       }
    }
}
.tail{
    width: 100%;
    height: r(290);
    background: #f3f4f6;
    padding: 0 r(30) 0 r(30);
    .tail_one{
        width: r(580);
        height: r(93);
        border-bottom: r(1) solid #e0e0e0;
        font-size: r(23);
        padding-top:r(33);
       ul{
           width: r(235);
           height: r(24);
           margin: 0 auto;
           li{
               float: left; 
               a{
                   color: #666666;
               }             
           }
           
       }
       ul>li:nth-child(1){
           padding-right: r(43);
       }
       
    }
    .youbei{
           width: 100%;
          height:r(195);
          background: #f3f4f6;
          padding: r(52) r(140) 0 r(210);
          color: #afaeae;
          .logo{
              width: r(52);              
              height: r(46);
              display:inline-block ;
              margin-top: r(8);
              margin-right: r(13);
              background: seagreen;
              
              img{
                  width: 100%;
                  height: 100%;
              }
          }
          .name{
              font-size: r(26);              
          }
          .Website{
              font-size: r(10);
          }
       }
       .service{
           font-size: r(19);
           padding-top: r(16);
           letter-spacing:r(2)
       }
}
